<template>
	<view>
		<!--头部-->
		<view class="navbarbox">
			<view class="navbar">
				<view class="navbartitle">帮助与反馈</view>
				<image @click="cancela" class="navbarimage" src="../../static/icon/lefticon.png"></image>
			</view>
		</view>
		<!-- 撑开 -->
		<view style="width: 100%;height: 90rpx;"></view>
		<view v-if="dianzanvalue==false" class="title">常见问题</view>
		<view v-if="dianzanvalue==false" class="listbox">
			<view v-for="(item,index) in listdata" :key="index" @click="dakai(index)" class="listview flex ac">
				<view class="listtitle">{{item.title}}</view>
				<image style="width: 50rpx;" mode="widthFix" src="../../static/icon/right1.png"></image>
			</view>
		</view>
		<!-- 撑开 -->
		<view v-if="dianzanvalue==false" style="width: 100%;height:30rpx;"></view>

		<view v-if="dianzanvalue==true" class="contentbox">
			<view v-if="dakaivalue==0" class="contentview">
				<view class="titlea">包邮规则说明</view>
				<view class="content_text">1，抓中的娃娃2件包邮，不足2个小时，需支付邮费；</view>
				<view class="content_text">2，活动赠送的娃娃不计入2件包邮；</view>
				<view class="content_text">3，活动赠送的娃娃每一笔订单最多可提交4个娃娃一起发货；</view>
				<view class="content_text">4，支付邮费之后，若特殊情况需要取消订单，平台原路返还邮费；</view>
			</view>
			<view v-if="dakaivalue==1" class="contentview">
				<view class="titlea">优惠券使用说明</view>
				<view class="content_text">1，如何获取优惠券</view>
				<view class="content_texta">xx中有两种渠道获取优惠券</view>
				<view class="content_texta">（1）用户购买会员赠送充值大礼包和包邮大礼包，礼包中含有超划算充值加成券和包邮券</view>
				<view>（2）xx应用会不会不定期给用户发放优惠券，用户可以</view>
				<view class="content_texta">常打开应用，在弹窗中领取（一般24小时内过期，领取的幸运儿要赶快使用哦）</view>
				<view class="content_text">2，优惠券有什么用？</view>
				<view class="content_texta">xx应用的优惠券有：充值加成券，包邮券，复活卡三</view>
				<view class="content_texta">（1）充值加成券：使用充值加成券充值乐乐时，会加赠</view>
				<view class="content_texta">充值加成券面值的乐乐哦</view>
				<view class="content_texta">（2）包邮券：一个娃娃不能包邮怎么办？包邮券可以</view>
				<view class="content_texta">（3）畅玩卡：使用畅玩卡直接抓娃娃，不再扣除乐币，畅快玩</view>
				<view class="content_texta">（4）金币卡：一种连续多天给你免费送币的优惠卡券</view>
				<view class="content_text">3，畅玩卡如何使用？</view>
				<view class="content_texta">（1）用户乐币充足同时有可用用畅玩卡时，优先使用畅</view>
				<view class="content_texta">玩卡</view>
				<view class="content_texta">（2）用户在当前房间有多畅玩卡可用时，优先使用</view>
				<view class="content_texta">娃娃专用畅玩卡，再使用币值较低的通用畅玩卡</view>
				<view class="content_texta">（3）有多张条件相同的畅玩卡可用时，优先使用将要</view>
				<view class="content_texta">过期的畅玩卡</view>
				<view class="content_texta">有畅玩卡的小伙伴们记得根据畅玩卡的可用币值选择机器哦。</view>
				<view class="content_text">4，金币卡如何赠送币？</view>
				<view class="content_texta">（1）金币卡是一种免费送币的卡券</view>
				<view class="content_texta">（2）不同的金币卡赠送天数不同</view>
				<view class="content_texta">（3）获得金币卡后，当天可获得赠送币，每天登录即可剩余天数的赠送奖励</view>
				<view class="content_texta">（4）未登录领取会过期作废哦</view>
				<view class="content_text">5，优惠券不见乐</view>
				<view class="content_texta">用户通过购买会员获取的优惠券，xx不过进行删除哦，只有xx赠送的优惠券，会定期删除已过期的优惠券</view>
				<view class="content_text">6，优惠券找零兑现吗？</view>
				<view class="content_texta">优惠券不找零，不兑现。</view>
			</view>
			<view v-if="dakaivalue==2" class="contentview">
				<view class="titlea">交易保障说明</view>
				<view class="content_text">交易保障说明</view>
				<view class="content_text">不可退！</view>
				<view class="content_text">本平台充值金额为虚拟商品，不支持退款！</view>
			</view>
			<view v-if="dakaivalue==3" class="contentview">
				<view class="titlea">xx抓娃娃简介</view>
				<view class="content_text">xx抓娃娃简介</view>
				<view class="content_text">xx抓娃娃是一款模拟真实场景化的线上娃娃机app,实时直播娃娃抓捕动态</view>
				<view class="content_text">懒人福利-随时随地打开手机即可抓取种类齐全的网红娃娃，感受线下抓娃娃的无限乐趣。</view>
				<view class="content_text">我们的亮点是：</view>
				<view class="content_texta">真实场景操控-远程控制线下娃娃机器，你与娃娃机相隔一个屏幕</view>
				<view class="content_text">抓捕动态直播-实时直播抓取过程，弹幕点赞围观评论</view>
				<view class="content_text">娃娃上新不断-各类网红娃娃，效率快递到手，留下收货地址，娃娃即刻整装待发<text style="color:#686868;">飞奔向你~</text>
				</view>
			</view>
			<view class="bordebox flex ac jc">
				<view class="borderview flex ac jc" @click="dianzandata(0)"
					:style="dianzan==0?'border: 1px solid #FFBB4A;color: #FFBB4A;':'border: 1px solid #909090;color: #909090;'">
					<image v-if="dianzan==0"
						src="https://jwwm.loovee.com/img/client/play/ww_bangzhu_icon_jiejue_press.png"></image>
					<image v-else src="https://jwwm.loovee.com/img/client/play/ww_bangzhu_icon_jiejue.png"></image>
					<view style="margin-left: 8rpx;">已解决</view>
				</view>
				<view class="borderview flex ac jc" @click="dianzandata(1)"
					:style="dianzan==1?'border: 1px solid #FFBB4A;color: #FFBB4A;':'border: 1px solid #909090;color: #909090;'">
					<image v-if="dianzan==1"
						src="https://jwwm.loovee.com/img/client/play/ww_bangzhu_icon_weijiejue_press.png"></image>
					<image v-else src="https://jwwm.loovee.com/img/client/play/ww_bangzhu_icon_weijiejue.png"></image>
					<view style="margin-left: 8rpx;">未解决</view>
				</view>
			</view>
		</view>
		
		<!-- 底部 -->
		<!-- <view class="buttombox">
			<image style="width: 50rpx;height: 50rpx;" src="https://jwwm.loovee.com/img/client/play/ww_bangzhu_icon_quanbu.png"></image>
			<view style="font-size: 28rpx;color:#686868;margin-left: 10rpx;">全部问题</view>
		</view> -->

	</view>
</template>

<script>
	export default {
		data() {
			return {
				dakaivalue: 0,
				dianzan: -1,
				dianzanvalue: false,
				listdata: [{
						index: 0,
						title: '包邮规则说明',
					},
					{
						index: 1,
						title: '优惠券使用说明',
					},
					{
						index: 2,
						title: '交易保障说明',
					},
					{
						index: 3,
						title: '自己名称简介',
					},
					{
						index: 4,
						title: '游戏小技巧',
					},
					{
						index: 5,
						title: '充值问题',
					},
					{
						index: 6,
						title: '用户需知',
					},
					{
						index: 7,
						title: '用户须知',
					},
					{
						index: 8,
						title: '关于抓中的奖品娃娃',
					},
					{
						index: 9,
						title: '幸运大转盘活动规则说明（抓娃娃）',
					},
					{
						index: 10,
						title: '幸运大转盘活动规则说明（抓娃娃）',
					},
				]
			}
		},

		methods: {
			cancela(e) {
				if (this.dianzanvalue == false) {
					uni.navigateBack({
						dalta: 1,
					})
				} else {
					this.dianzanvalue = false
					this.dianzan = -1
				}
			},

			dakai(e) {
				this.dakaivalue = e
				this.dianzanvalue = true
			},

			dianzandata(e) {
				this.dianzan = e
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: #F7F7F7;
	}

	// 头部
	.navbarbox {
		width: 100%;
		height: 90rpx;
		background-color: #ffffff;
		position: fixed;
		left: 0;
		top: 0;
	}

	.navbar {
		width: 100%;
		height: 90rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		position: relative;
	}

	.navbartitle {
		color: #000000;
		font-size: 32rpx;
		font-weight: 700;
		padding: 0 45rpx;
	}

	.navbarimage {
		position: absolute;
		width: 35rpx;
		height: 35rpx;
		top: 30rpx;
		left: 20rpx;
	}

	.title {
		font-size: 30rpx;
		font-weight: bold;
		padding: 20rpx 20rpx;
	}

	.listbox {
		width: 100%;
		background-color: #ffffff;
		padding: 0 20rpx;
	}

	.listview {
		padding: 30rpx 0;
		border-bottom: 1rpx solid #E5E7E9;
	}

	.listview:last-child {
		border-bottom: none;
	}

	.listtitle {
		font-size: 30rpx;
		flex: 1;
	}

	.titlea {
		padding: 30rpx 0;
		border-bottom: 1rpx solid #E5E7E9;
		font-size: 31rpx;
		font-weight: bold;
		margin-bottom: 30rpx;
	}

	.contentbox {
		background-color: #ffffff;
	}

	.contentview {
		padding: 0 20rpx;
	}

	.content_text {
		font-size: 28rpx;
		color: #303030;
		margin-bottom: 10rpx;
		line-height: 40rpx;
	}

	.content_texta {
		font-size: 28rpx;
		color: #303030;
		margin-bottom: 10rpx;
		line-height: 40rpx;
		margin-left: 10rpx;
	}

	.bordebox {
		padding-top: 80rpx;
		padding-bottom: 80rpx;
	}

	.borderview {
		width: 160rpx;
		height: 60rpx;
		border-radius: 50rpx;
		margin: 0 30rpx;
		font-size: 26rpx;
	}

	.borderview image {
		width: 30rpx;
		height: 30rpx;
	}
	
	// 底部
	.buttombox{
		width: 100%;
		height: 100rpx;
		border: 1rpx solid #D5D5D5;
		position: fixed;
		left: 0;
		bottom: 0;
		background-color: #ffffff;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>